﻿@model SMECustomerWebsite.Models.ViewModels.AdminChecklist.QuetionChecklistViewModel
<ul id="menu_product_handbook_detail" class="nav nav-tabs bar_tabs sme-tabs" role="tablist">
    @*<li role="presentation" class="">
            @Html.ActionLink(@SMECustomerWebsite.Core.Resources.Resource.ProHandbookProDetailInfoTab, "ProductDetail", "ProductHandbook", new { productid = Request.QueryString["productid"] }, null)
        </li>*@
    <li role="presentation" class="active">
        @Html.ActionLink(@SMECustomerWebsite.Core.Resources.Resource.ProHandbookProDetailChecklistTab, "Checklist", "ProductHandbook", new { productid = Request.QueryString["productid"] }, null)
    </li>
</ul>

<!--Modal  question -->
<div class="modal fade cm-celebration-representative-info" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
                @{
                    List<SelectListItem>
                        listItems = new List<SelectListItem>
                            ();
                    listItems.Add(new SelectListItem
                    {
                        Text = "Any",
                        Value = "",
                        Selected = true
                    });
                    listItems.Add(new SelectListItem
                    {
                        Text = "Yes",
                        Value = "Y"
                    });
                    listItems.Add(new SelectListItem
                    {
                        Text = "No",
                        Value = "N"
                    });
                    List<SelectListItem>
                        listSubItems = new List<SelectListItem>
                            ();
                    Model.listSubProduct.ForEach(x =>
                    {
                        listSubItems.Add(new SelectListItem
                        {
                            Text = x.SubProductNameEn,
                            Value = x.SubProductId.ToString()
                        });
                    });
                }
                <form id="cust_checklist_question" method="post" class="form-horizontal form-label-left">
                    @Html.Hidden("ruleid", 0, new { id = "ruleIdHidden" })
                    <div class="form-group">
                    </div>
                    <div class="form-group">
                        <label class="control-label" style="text-align:left" id="">@SMECustomerWebsite.Core.Resources.Resource.Product</label>
                        @Html.DropDownList("subProduct", listSubItems, new { @class = "btn btn-primary", id = "subIdHidden" })
                    </div>
                    @foreach (var item in Model.listQuestion)
                    {
                        <div class="form-group">
                        </div>
                        <div class="form-group">
                            <label class="control-label" style="text-align:left" id="label_@item.QuestionId">@item.Title </label>
                            <div style="float:right">
                                @Html.DropDownList("choose_" + item.QuestionId, listItems, new { @class = "btn btn-primary", id = "choose_answer_" + item.QuestionId })
                            </div>
                        </div>
                    }
                    <div class="col-md-12 col-md-offset-3">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary" onclick="submitData();">Save changes</button>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>
<!-- /modals -->
<div class="row">
    <div class="col-md-12">
        <div class="x_panel">
            <div class="x_title">
                <h2>CHECKLIST CUSTOMER</h2>
                <ul class="nav navbar-right panel_toolbox">
                    <li>
                        <a onclick="return addRule();"><i class="fa fa-plus-square"></i></a>
                    </li>
                    <li>
                        <a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                @Html.Action("SubMenuAdminChecklistDetail", "System")
                <div class="table-responsive">
                    <table id="checklist_document" class="custom_table table table-striped jambo_table bulk_action">
                        <thead>
                            <tr class="headings">
                                <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.Product.ToUpper()</th>
                                <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.GroupHeader.ToUpper()</th>
                                <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.AdminChecklistQuestionTab.ToUpper()</th>
                                <th class="column-title" width="30%">@SMECustomerWebsite.Core.Resources.Resource.AnswerHeader.ToUpper()</th>
                                <th class="column-title last">@SMECustomerWebsite.Core.Resources.Resource.ActionHeader.ToUpper()</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!-- End to do list -->
</div>
@section scripts
{

    <script src="~/scripts/tableeditable/dataTables.rowsGroup.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {

            var table = $('#checklist_document').DataTable({
                bFilter: false,
                bInfo: true,
                bPaginate: true,
                "responsive": true,
                "bAutoWidth": false,
                "bServerSide": true,
                //"bProcessing": true,
                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                "sPaginationType": "simple_numbers",//"full_numbers",
                "sAjaxSource": '@Url.Action("RuleChecklistData", "AdminChecklist", new { productid = Model.ProductID})',
                "fnServerData": function (sSource, aoData, fnCallback) {
                    $.ajax({
                        "dataType": 'json',
                        "type": "POST",
                        "url": sSource,
                        "data": aoData,
                        "success": fnCallback
                    });
                },
                rowsGroup: [0, 1, 4],
                fixedHeader: true,
                "aoColumns": [
                            { "sName": "DATE OPEN", "className": 'column-title', "bSortable": false },
                            { "sName": "VPB INDUSTRY", "className": 'column-title', "bSortable": false },
                            { "sName": "VPB INDUSTRY", "className": 'column-title', "bSortable": false },
                            { "sName": "DATE OPEN", "className": 'column-title', "bSortable": false },
                            { "sName": "VPB INDUSTRY", "className": 'column-title', "bSortable": false }],
                "columnDefs": [{
                    "sClass": "a-center ",
                    "aTargets": 4,
                    "mRender": function (data, type, full) {
                        if (data != null) {
                            return '<a class="btn btn-primary btn-xs" onclick="editRule(\'' + full[4] + '\');"><i class="fa fa-edit"></i></a>';
                        } else {
                            return data;
                        }
                    }
                }],
                "drawCallback": function (settings) {
                    $('table.custom_table th').removeClass().addClass('column-title');
                }
            });

        });
        function editRule(question) {
            var data = $('[id^=choose_answer_]');
            var content = [];
            data.each(function (index, item) {
                item.value = '';
            });
            $.ajax({
                url: '@Url.Action("Ruleinfo", "AdminChecklist")',
                type: "POST",
                data: { questionid: question },
                success: function (data_response) {
                    $('#ruleIdHidden').val(question);
                    if (data_response != null && data_response.length > 0) {
                        data_response.forEach(function (entry) {
                            $('#subIdHidden').val(entry['subId']);
                            $('#choose_answer_' + entry['id']).val(entry['answer']);
                        });
                    }

                    $('.cm-celebration-representative-info').modal('show');
                }
            });
            return false;
        }
        function submitData() {
            if ($('#subIdHidden').val() == null) {
                alert('Please choose product!');
            } else {

                var data = $('[id^=choose_answer_]');
                var ruleId = $('#ruleIdHidden').val();
                var subId = $('#subIdHidden').val();
                var content = [];
                data.each(function (index, item) {
                    var row = [];
                    row.push(item.name);
                    row.push(item.value);
                    content.push(row);
                });
                var jsonData = JSON.stringify(content);
                $.ajax({
                    url: '@Url.Action("UpdateRule", "AdminChecklist")',
                    type: "POST",
                    data: { dataedit: jsonData, ruleid: ruleId, productId: '@Model.ProductID', subId: subId },
                    success: function (data_response) {
                        if (data_response == true) {
                            window.location.replace("@Url.Action("RuleChecklist", "AdminChecklist", new { productid = Model.ProductID })");
                        }
                    }
                })
            }
            return false;
        }
        function addRule() {
            var ruleId = $('#ruleIdHidden').val('0');
            var subId = $('#subIdHidden').val('0');
            $('.cm-celebration-representative-info').modal('show');
            return false;
            //e.preventDefault()
        }
    </script>
}
